簡介:通過本課程,讓您掌握鼠標滾輪事件的細節,并能通過掌握細節實現自定義滾動條的效果。我們學完后也可以將鼠標滾輪事件封裝成組件,通過封裝的組件實現一個復雜的交互效果,深入理解滾輪事件的交互。
第1章 介紹課程目標和學習內容
通過詳細的細分教學,讓學生掌握鼠標滾輪事件的細節,并能通過掌握的細節實現自定義滾動條的效果。并能將鼠標滾輪事件封裝成組件。通過封裝的組件實現一個復雜的交互效果,深入理解滾輪事件的交互
第2章 案例HTML和CSS搭建
分析并完成示例的HTML結構,并同時完成標簽區域和滾動區域的樣式,實現案例整體外觀。
第3章 實現案例交互
介紹自調用匿名函數,jQuery.extend方法的使用,實現可復用的JS代碼組織結構。講解拖動滑塊內容滾動的思路,以及基本的事件綁定與解除,事件命令空間的使用,了解jQuery中outerHeight()與height()的區別,掌握實現標簽切換時實現文章定位的思路。
第4章 總結課程
通過本課程,我們學習了鼠標的滾輪事件,以及如何封裝成jQuery事件組件。結合實際的例子,我們實現了如何通過鼠標滾輪事件控制文本內容的滾動。